import Link from "next/link"

function Container({datas}) {
    return (
        <div className='pt-10'>
            <h1 className="text-left text-2xl font-bold">教員リスト</h1>
                <div className="divider"></div>
            {
              datas && datas.map((t, k) => {
                    return (
                        <div key={k} className="card card-side bg-base-100 shadow-xl border-2 border-solid pl-10 pr-10 mt-5 pt-5 pb-5">
                            <figure style={{ flex: 1 }}>
                                <img
                                    src={t.profilePic}
                                    alt="teacher" />
                            </figure>
                            <div className="card-body" style={{flex:3}}>
                                <h2 className="card-title">教員： {t.name}</h2>

                                <p>{t.text}</p>
                                <div className="card-actions justify-end">
                                    <Link href={k ? `teacher2-detail?id=${k}` :`teacher-detail?id=${k}`} className="btn btn-primary">プロフィール</Link>
                                </div>
                            </div>
                        </div>
                    )
                })

            }

        </div>
    )
}

export default Container